<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


<div class="layui-fluid">
    <div class="layui-card">

        <div class="layui-card-header "  style="color:#d02e25;font-family: '楷体'; ">
            组织人员出国管理
        </div>

        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item refresh-nav" align="center" style="font-family: '宋体'; font-size: 20px;">
                <div class="layui-inline">
                    <label class="layui-form-label">目标国家</label>
                    <div class="layui-input-inline">
                        <input style="height: auto;margin-top: 5px" type="text" id="aimCountry" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-inline">
                        <input style="height: auto;margin-top: 5px" type="text"  id="name" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" id="searchBtn" data-type="reload">搜索</button>
                </div>
            </div>
            <div class="layui-card-body">
                <table id="abroadlist" lay-filter="abroadlist"></table>
            </div>
        </div>
    </div>





    <script>
        layui.use(['table','form'], function(){
            var table = layui.table
                ,form = layui.form;

            //农资列表
            table.render({
                elem: '#abroadlist'
                // ,height: 'full-200'
                ,method: 'post'
                ,url: '/ajax/party/admin/abroadlist'
                ,page: true
                ,loading: true
                ,cellMinWidth: 80
                ,limit: 20
                ,id: 'abroadlist'
                ,cols: [[
                    {field: 'id', title: '编号', width: 120, sort: true, fixed: 'left'}
                    ,{field: 'destination', title: '目的地 ',width:120}
                    ,{field: 'updateTime', title: '录入时间',width:200}
                    ,{field: 'level', title: '级别'}
                    ,{field: 'name', title: '姓名 ',width:100}
                    ,{field: 'abdStatus', title: '状态',templet: '#sexTpl', unresize: true,width:80}
                    ,{field: 'company', title: '单位名称 '}
                    ,{fixed: 'right', title: '操作', align: 'center', width: 120, toolbar: '#dothing' }
                ]]
            });


            //搜索
            layui.$("#searchBtn").click(function () {
                var aimCountry = $('#aimCountry').val();//获取输入框的值
                var name = $("#name").val();


                table.reload('abroadlist',
                    {
                        page:true
                        ,limit:10
                        ,where: { aimCountry: aimCountry,
                            name:name}//这里传参  向后台
                        ,url: '/ajax/party/admin/searchAbroad'//后台做模糊搜索接口路径
                        ,method: 'post',
                    });

            });




            //监听工具条
            table.on('tool(abroadlist)', function(obj){
                var data = obj.data;

                if(obj.event === 'detail'){

                    $.post('/ajax/party/admin/getOneAbd',{
                        id:data.id
                    },function(result){
                        layer.open({
                            type: 1,
                            area: ['1200px','80%'],
                            title: "ID:" + data.id,
                            offset: '10%',
                            anim: 4,
                            shadeClose: true,
                            content: showdetails(result.data)
                        });
                        console.log(result);
                        var ins = result.data.inName1;
                        console.log(ins.length);
                        //动态添加div
                        // var insBody = ;
                        for(var i=0;i<ins.length;i++){
                            $("#inCountry").append('    <div class="layui-form-item">\n' +
                                '        <label class="layui-form-label">姓名</label>\n' +
                                '        <div class="layui-input-inline">\n' +
                                '            <input type="text"   name="inName1" value='+ ins[i] +'  lay-verify="required"\n' +
                                '                   autocomplete="off" class="layui-input">\n' +
                                '        </div>\n' +
                                '\n' +
                                '        <label class="layui-form-label">关系</label>\n' +
                                '        <div class="layui-input-inline">\n' +
                                '            <input type="text" name="inShip1" value='+ result.data.inShip1[i] +' lay-verify="required"\n' +
                                '                   autocomplete="off" class="layui-input">\n' +
                                '        </div>\n' +
                                '\n' +
                                '        <label class="layui-form-label">工作</label>\n' +
                                '        <div class="layui-input-inline">\n' +
                                '            <input type="text" name="inJob1" value='+ result.data.inJob1[i] +' lay-verify="required"\n' +
                                '                   autocomplete="off" class="layui-input">\n' +
                                '        </div>\n' +
                                '    </div>');

                        }

                        var outs = result.data.outName1;
                        for (var i=0;i<outs.length;i++){
                            $("#outCountry").append(' <div class="layui-form-item">\n' +
                                '        <label class="layui-form-label">姓名</label>\n' +
                                '        <div class="layui-input-inline">\n' +
                                '            <input type="text" name="outName1" value='+ result.data.outName1[i] +' lay-verify="required"\n' +
                                '                   autocomplete="off" class="layui-input">\n' +
                                '        </div>\n' +
                                '\n' +
                                '        <label class="layui-form-label">关系</label>\n' +
                                '        <div class="layui-input-inline">\n' +
                                '            <input type="text" name="outShip1" value='+ result.data.outShip1[i] +' lay-verify="required"\n' +
                                '                   autocomplete="off" class="layui-input">\n' +
                                '        </div>\n' +
                                '\n' +
                                '        <label class="layui-form-label">工作</label>\n' +
                                '        <div class="layui-input-inline">\n' +
                                '            <input type="text" name="outJob1" value='+ result.data.outJob1[i] +' lay-verify="required"\n' +
                                '                   autocomplete="off" class="layui-input">\n' +
                                '        </div>\n' +
                                '    </div>');
                        }

                    });


                } else if(obj.event === 'del'){
                    layer.confirm('真的删除行么', function(index){
                        $.post("/ajax/party/admin/delrdsq",{
                            id:data.id
                        },function(result){
                            console.log(result);
                            if(result.code==0){
                                layer.alert("删除成功！");
                            }
                            obj.del();
                            layer.close(index);
                        });
                    });
                }
            });




        });
    </script>

    <script>
        function showdetails(data) {
            console.log(data);
            var s = ' <form class="layui-form" id="form1">\n' +
                '        <div class="layui-card">\n' +
                '\n' +
                '            <div class="layui-card-body">\n' +
                '                <div class="layui-card-header"  style="color:#d02e25;font-family: \'楷体\'; ">\n' +
                '                    个人基本信息\n' +
                '                </div>\n' +
                '                <div class="layui-form-item">\n' +
                '                    <label class="layui-form-label">干部姓名</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdName" value='+ data.abdName +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">性别</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdSex" value='+ data.abdSex +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">健康状态</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdHealth" value='+ data.abdHealth +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-form-item">\n' +
                '                    <label class="layui-form-label">所在单位</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="toGroup" value='+ data.toGroup +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">职务</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdPost" value='+ data.abdPost +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">级别</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdLevel" value='+ data.abdLevel +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-form-item">\n' +
                '                    <label class="layui-form-label">政治面貌</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdIdentity" value='+ data.abdIdentity +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">出国目的地</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdDestination" value='+ data.abdDestination +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">状态</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="status" value='+ data.status +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-form-item">\n' +
                '                    <label class="layui-form-label">出国时间</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdBeginDate" value='+ data.abdBeginDate +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">结束时间</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdEndDate" value='+ data.abdEndDate +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">经费渠道</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdFunds" value='+ data.abdFunds +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-form-item">\n' +
                '                    <label class="layui-form-label">国内通讯</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdTelWithIn" value='+ data.abdTelWithIn +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">国外通讯</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdTelWithOut" value='+ data.abdTelWithOut +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '\n' +
                '                    <label class="layui-form-label">出行方式</label>\n' +
                '                    <div class="layui-input-inline">\n' +
                '                        <input type="text" name="abdTripMode"  value='+ data.abdTripMode +' lay-verify="required"\n' +
                '                               autocomplete="off" class="layui-input">\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-form-item">\n' +
                '                    <label class="layui-form-label">备注说明</label>\n' +
                '                    <div class="layui-input-inline" style="width: 70%;">\n' +
                '                        <textarea   class="layui-textarea">'+ data.abdRemark +'</textarea>\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-card-header"  style="color:#d02e25;font-family: \'楷体\'; ">\n' +
                '                    亲属信息\n' +
                '                </div>\n' +
                '                <div class="layui-card-body" id="inCountry">\n' +
                '                    <label class="layui-form-label">国内亲属</label>\n' +
                '\n' +
                '\n' +
                '                </div>\n' +
                '\n' +
                '                <div class="layui-card-body" id="outCountry">\n' +
                '                    <label class="layui-form-label">国外亲属</label>\n' +
                '\n' +
                '\n' +
                '                </div>\n' +
                '\n' +
                '\n' +
                '\n' +
                '            </div>\n' +
                '        </div>\n' +
                '    </form>';

            return s;
        }


    </script>

    <script type="text/html" id="dothing">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>

        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>

    <script type="text/html" id="sexTpl">

        <%--<input type="text" name="sex" value="{{d.abdStatus==1?'未归':'已回国'}}" lay-skin="switch" lay-text="已回国|未归" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>--%>
           <%--判断表格中的数据--%>
            {{#  if( d.abdStatus == 1){ }}
                {{ d.abdStatus='未归' }}
                {{#  }  }}
            {{#  if( d.abdStatus == 0){ }}
            {{ d.abdStatus='已回国' }}
            {{#  }  }}

    </script>

</div>